<template>
  <div class="reviewDoctor padding_20">
    <el-input v-model="nickName"
              placeholder="请输入医生名称"
              class="w-200"
              clearable
              @clear="handleQuery" />
    <el-button type="primary"
               @click="handleQuery">查 询</el-button>
    <el-button @click="toggleSelection(tableData)">全选/反选</el-button>
    <el-button type="primary"
               @click="passAll"
               :disabled="this.multipleSelection.length > 0 ? false : true">通 过</el-button>
    <el-table class="mt-20"
              border
              :data="tableData"
              v-loading="loading"
              ref="multipleTable"
              @selection-change="handleSelectionChange"
              style="width: 100%">
      <el-table-column type="selection"
                       width="55">
      </el-table-column>
      <el-table-column prop="headImageUrl"
                       label="头像"
                       width="120"
                       align="center">
        <template slot-scope="scope">
          <el-image style="width: 80px; height: 80px; border:50%;"
                    :src="scope.row.headImageUrl"
                    :preview-src-list="[scope.row.headImageUrl]">
          </el-image>
        </template>
      </el-table-column>
      <el-table-column prop="nickName"
                       label="医生"
                       width="100">
      </el-table-column>
      <el-table-column prop="isExpert"
                       label="专家"
                       width="100"
                       align="center">
        <template slot-scope="scope">
          <el-tag type="success"
                  v-if="scope.row.isExpert === 0">非专家</el-tag>
          <el-tag type="success"
                  v-if="scope.row.isExpert === 1">三甲专家</el-tag>
          <el-tag type="success"
                  v-if="scope.row.isExpert === 2">专科专家</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="sex"
                       label="性别"
                       width="50"
                       align="center">
        <template slot-scope="scope">
          {{scope.row.sex === 1 ? '男' : '女'}}
        </template>
      </el-table-column>
      <el-table-column prop="hospitalName"
                       label="医院&科室">
      </el-table-column>
      <el-table-column prop="isAuth"
                       label="审核状态"
                       width="100">
        <template slot-scope="scope">
          <el-tag type="success"
                  v-if="scope.row.isAuth === 0">待提交</el-tag>
          <el-tag type="danger"
                  v-if="scope.row.isAuth === 1">待审核</el-tag>
          <el-tag type="info"
                  v-if="scope.row.isAuth === 2">通过</el-tag>
          <el-tag type="info"
                  v-if="scope.row.isAuth === -1">驳回</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="introduce"
                       label="简介"
                       show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="remark"
                       label="获奖经历"
                       show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="qualiUrl"
                       label="执业证"
                       width="100"
                       align="center">
        <template slot-scope="scope">
          <el-image style="width: 60px; height: 60px"
                    :src="scope.row.doctorBase.qualiUrl"
                    :preview-src-list="[scope.row.doctorBase.qualiUrl]">
          </el-image>
        </template>
      </el-table-column>
      <el-table-column prop="certiUrl"
                       label="工作证"
                       width="100"
                       align="center">
        <template slot-scope="scope">
          <el-image style="width: 60px; height: 60px"
                    :src="scope.row.doctorBase.certiUrl"
                    :preview-src-list="[scope.row.doctorBase.certiUrl]">
          </el-image>
        </template>
      </el-table-column>
      <el-table-column prop="doctorSign"
                       label="签名"
                       width="100"
                       align="center">
        <template slot-scope="scope">
          <el-image style="width: 60px; height: 60px"
                    :src="scope.row.doctorSign"
                    :preview-src-list="[scope.row.doctorSign]">
          </el-image>
        </template>
      </el-table-column>
      <el-table-column prop="createTime"
                       label="创建时间">
        <template slot-scope="scope">
          {{commonFunction.timestampFormat(new Date(scope.row.createTime), 'yyyy-MM-dd hh:mm')}}
        </template>
      </el-table-column>
      <el-table-column prop="action"
                       label="操作"
                       width="160"
                       align="center">
        <template slot-scope="scope">
          <el-button type="primary"
                     size="mini"
                     @click="reviewAccept(scope.row, scope.$index)">通 过</el-button>
          <el-button type="danger"
                     size="mini"
                     @click="reviewRefuse(scope.$index)">驳 回</el-button>
        </template>
      </el-table-column>
    </el-table>
    <p class="mt-20"
       align="right">
      <el-pagination background
                     @current-change="handleChangePage"
                     :current-page.sync="pageIndex"
                     :page-size="pageSize"
                     layout="total, prev, pager, next"
                     :total="pageTotal">
      </el-pagination>
    </p>
    <el-dialog title="驳回"
               :visible.sync="dialogVisible"
               width="30%"
               @close="handleClose">
      <el-form ref="formRefs"
               :model="formModel"
               :rules="formRules"
               label-width="120px">
        <el-form-item prop="selectReason"
                      label="选择驳回理由">
          <el-select v-model="formModel.selectReason"
                     class="w-200"
                     @change="setReason"
                     placeholder="请选择驳回理由">
            <el-option v-for="item in fastList"
                       :value="item.value"
                       :label="item.label"
                       :key="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="reason"
                      label="驳回理由">
          <el-input v-model="formModel.reason"
                    type="textarea"
                    :rows="4"
                    placeholder="请输入驳回理由" />
        </el-form-item>
      </el-form>
      <span slot="footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary"
                   @click="goToRefuse">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: "reviewDoctor",
    data () {
      return {
        loading: false,
        dialogVisible: false,
        nickName: '',
        fastList: [{
          value: "请上传执业证照片！",
          label: "请上传执业证照片！"
        }, {
          value: "请上传工作证照片！",
          label: "请上传工作证照片！"
        }, {
          value: "请上传工作正面照片！",
          label: "请上传工作正面照片！"
        }, {
          value: "请上传执业证和工作证照片！",
          label: "请上传执业证和工作证照片！"
        }, {
          value: "请设置签名，谢谢！",
          label: "请设置签名，谢谢！"
        }, {
          value: "姓名录入不规范，请录入真实姓名！",
          label: "姓名录入不规范，请录入真实姓名！"
        }, {
          value: "上传的头像照片不规范，请上传工作服正面免冠照片！",
          label: "上传的头像照片不规范，请上传工作服正面免冠照片！"
        }, {
          value: "上传的执业证照片不规范，请重新上传！",
          label: "上传的执业证照片不规范，请重新上传！"
        }, {
          value: "上传的工作证照片不规范，请重新上传！",
          label: "上传的工作证照片不规范，请重新上传！"
        }, {
          value: "其他",
          label: "其他"
        }],
        prescription: '',
        dataIndex: null,
        tableData: [],
        pageTotal: 0,
        pageIndex: 1,
        pageSize: 10,
        formModel: {
          reason: null,
          selectReason: null,
        },
        formRules: {
          selectReason: [{ required: true, message: '请选择驳回理由!', trigger: 'chagne' }],
          reason: [{ required: true, message: '请输入驳回理由!', trigger: 'blur' }],
        },
        multipleSelection: [],
        allSelect: false
      }
    },
    created () {
      this.getList();
    },
    methods: {
      handleQuery() {
        this.pageIndex=1
        this.getList()
      },
      async getList () {
        this.loading = true;
        const { data: res } = await this.post(this.api.doctorManager.reviewList, {
          nickName: this.nickName,
          pageIndex: this.pageIndex - 1,
          pageSize: this.pageSize
        });
        if (res.code === '200') {
          this.loading = false;
          this.tableData = res.object;
          this.pageTotal = res.totalNum;
        }
      },
      // 分页
      handleChangePage (page) {
        this.pageIndex = page;
        this.getList();
      },
      toggleSelection (rows) {
        console.log(rows);
        if (rows) {
          rows.forEach(row => {
            this.$refs.multipleTable.toggleRowSelection(row, !this.allSelect);
          });
          this.allSelect = !this.allSelect;
        } else {
          this.$refs.multipleTable.clearSelection();
        }


      },
      handleSelectionChange (val) {
        this.multipleSelection = val;
      },
      // 全选通过
      passAll () {

        this.$confirm('是否通过所选？')
          .then(_ => {

          })
          .catch(_ => { });
      },
      // 通过
      reviewAccept (row, index) {
        if (row.doctorTitleDto.type === 0) {
          this.prescription = 1;
        } else {
          this.prescription = 0;
        }
        this.dataIndex = index;
        this.goToAccess();
      },
      goToAccess () {
        if (this.dataIndex == null) {
          this.$message.warning('请选择一条数据!');
          return;
        }
        let data = this.tableData[this.dataIndex];
        data.prescription = this.prescription;

        this.$confirm('确认通过？')
          .then(_ => {
            this.post(this.api.doctorManager.reviewAccept, data).then((res) => {
              if (res.data.code === '200') {
                this.getList();
                this.$message.success('操作成功！');
                this.dataIndex = null;
              }
            });
          })
          .catch(_ => { });
      },
      setReason (index) {
        this.formModel.reason = index;
      },
      reviewRefuse (index) {
        this.dataIndex = index;
        this.dialogVisible = true;
      },
      goToRefuse () {
        this.$refs.formRefs.validate((valid) => {
          if (valid) {
            let obj = this.tableData[this.dataIndex];
            obj.remark = this.formModel.reason;
            this.post(this.api.doctorManager.reviewRefuse, obj).then((res) => {
              if (res.data.code === '200') {
                this.$message.success('驳回成功!');
                this.dialogVisible = false;
                this.$refs.formRefs.resetFields();
                this.getList();
                this.dataIndex = null;
              }
            });
          }
        })
      },
      handleClose () {
        this.dialogVisible = false;
        this.$refs.formRefs.resetFields();
        this.dataIndex = null;
      }
    },
  }
</script>

<style  lang="scss">
</style>
